import { _decorator, Color, Component, Graphics, Node, UITransform, Vec2, Vec3 } from 'cc';
const { ccclass, property } = _decorator;

@ccclass('DrawingArc')
export class DrawingArc extends Component {

    @property(Graphics)
    graphics: Graphics = null;

    @property(UITransform)
    UITransfrom: UITransform = null;


    init(parent: Node, worldPos: Vec3, radius: number, width: number, angle: number, color) {
        this.node.parent = parent;
        this.node.setPosition(Vec3.ZERO);

        // 圆心坐标
        const centerX = 0;
        const centerY = 0;

        //世界坐标转化为本地坐标
        const localPos: Vec3 = this.UITransfrom.convertToNodeSpaceAR(worldPos);

        // 起始点的位置（在圆周上的点）
        const startX = localPos.x;  // 示例值
        const startY = localPos.y;  // 示例值

        // 计算从圆心到起始点的角度
        const startAngle = Math.atan2(startY - centerY, startX - centerX);

        // 终止角度可以是一个偏移值，假设画一个30度的圆弧
        const arcLength = angle * Math.PI / 180;  // 30度的弧度

        // 绘制圆弧
        this.drawArc(centerX, centerY, radius, startAngle - arcLength / 2, startAngle + arcLength / 2, width, color);

    }

    // 绘制圆弧
    drawArc(centerX: number, centerY: number, radius: number, startAngle: number, endAngle: number, width: number, color: Color) {
        this.graphics.clear(); // 清除之前的绘制

        // 起始点
        const startX = centerX + Math.cos(startAngle) * radius;
        const startY = centerY + Math.sin(startAngle) * radius;

        // 终止点
        const endX = centerX + Math.cos(endAngle) * radius;
        const endY = centerY + Math.sin(endAngle) * radius;

        // 设置绘制样式
        this.graphics.lineWidth = width;
        this.graphics.strokeColor = color;

        // 从起点开始绘制
        this.graphics.moveTo(startX, startY);

        // 绘制圆弧
        this.graphics.arc(centerX, centerY, radius, startAngle, endAngle, true);
        this.graphics.stroke();
    }
}


